<!-- Base MasterSlider style sheet -->
<link rel="stylesheet" href="catalog/view/javascript/masterslider/style/masterslider.css" />

<!-- Master Slider Skin 
	<link href="catalog/view/javascript/masterslider/skins/default/style.css" rel='stylesheet' type='text/css'>
-->

<!-- MasterSlider Template Style -->
<?php if($type == "3d"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-caro3d.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "tabs"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-tabs-style.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "fullscreen"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-home.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "partialview"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-partialview.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "showcase" || $type == "showcase_v" ){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-showcase2.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "vertical"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-vertical.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "videogallery" || $type =="videogallery_v"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-videogallery.css' rel='stylesheet' type='text/css'>
<?php }else  if($type == "gallery"){ ?> 
	<link href='catalog/view/javascript/masterslider/style/ms-gallery-style.css' rel='stylesheet' type='text/css'>
<?php } ?>

<!--
<script src="catalog/view/javascript/masterslider/jquery.easing.min.js"></script>
-->
<!-- Master Slider -->
<script src="catalog/view/javascript/masterslider/masterslider.min.js"></script>

<script src="catalog/view/javascript/masterslider/masterslider.partialview.dev.js"></script> 
<?php  if($type == "gallery"){ ?>
<script src="catalog/view/javascript/masterslider/masterslider.gallery.js"></script> 
<?php } ?>
<!-- template -->
<div class="<?php echo $span_width; ?>">
<?php 
$classTemplate="";
 if($type == "3d"){
	$classTemplate="ms-caro3d-template";
 }else if($type == "tabs"){
 	$classTemplate="ms-tabs-template";
 }else if($type == "fullscreen"){
 	$classTemplate="master-slider ms-skin-default";
 }else if($type == "partialview"){
 	$classTemplate="ms-partialview-template";
 }else if($type == "showcase"){
 	$classTemplate="ms-showcase2-template";
 }else if($type == "showcase_v"){
 	$classTemplate="ms-showcase2-template ms-showcase2-vertical";
 }else if($type == "vertical"){
 	$classTemplate="ms-vertical-template  ms-tabs-vertical-template";
 }else if($type == "videogallery"){
 	$classTemplate="ms-videogallery-template";
 }else if( $type =="videogallery_v"){
 	$classTemplate="ms-videogallery-template  ms-videogallery-vertical-template";
 }else if( $type =="gallery"){
 	$classTemplate="ms-gallery-template";
 }

?>
	<div class="<?php echo $classTemplate; ?>" id="partial-view-1">
		<!-- masterslider -->
		<div class="master-slider ms-skin-default" id="masterslider">
			 <?php $x=1; foreach ($banners as $banner) { ?>
			<div class="ms-slide slide-<?php echo $x;?>">
				<div class="slide-pattern"></div>
				<img src="catalog/view/javascript/masterslider/blank.gif" data-src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" /> 
				
				<?php if($type=="tabs"){?>
					<div class="ms-thumb">
						<h3><?php echo $banner['title']; ?></h3>
						 <?php if ($banner['link']) { ?>
						 	<p><a href="<?php echo $banner['link']; ?>"><?php echo $view_details; ?></a></p>
						 <?php } ?>
					</div>
				<?php }else if($type=="partialview"){ ?>
					<div class="ms-info">
						<h3><?php echo $banner['title']; ?></h3>
						 <?php if ($banner['link']) { ?>
						 	<p><a href="<?php echo $banner['link']; ?>"><?php echo $view_details; ?></a></p>
						 <?php } ?>
                    </div> 
				<?php } ?>
				
				<?php if($type=="showcase" || 
						$type =="showcase_v" || 
						$type =="vertical" ||
						$type =="videogallery" ||
						$type =="videogallery_v" || 
						$type =="gallery"){ ?>
					<img class="ms-thumb" src="<?php echo $banner['image']; ?>" alt="thumb" style="width:<?php echo $width_thumb; ?>px; height:<?php echo $height_thumb; ?>px" />
				<?php } ?>

				<?php if($type=="gallery"){ ?>
					<div class="ms-info">
						<?php echo $banner['title']; ?>
                    </div> 
				<?php } ?>
				
			</div>
			<?php  $x ++; } ?>
		</div>
		<!-- end of masterslider -->
	</div>
</div>
<!-- end of template -->
<?php if($type == "3d"){ ?> 
<script type="text/javascript">
    var slider = new MasterSlider();
    slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space:0,
        loop:true,
        view:'flow'
    });
    slider.control('arrows');
</script>
<?php }else  if($type == "tabs"){ ?> 
	<script type="text/javascript">      
	    var slider = new MasterSlider();
	    slider.setup('masterslider' , {
	        width:<?php echo $width; ?>,
	        height:<?php echo $height; ?>,
	        space:0,
	        preload:'all',
	        view:'basic'
	    });
	    slider.control('arrows');  
	    slider.control('circletimer' , {color:"#FFFFFF" , stroke:9});
	    slider.control('thumblist' , {autohide:false ,dir:'h'});
	</script>
<?php }else  if($type == "fullscreen"){ ?> 
<script type="text/javascript">
    var slider = new MasterSlider();
     slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
         space:1,
         fullwidth:true,
         loop:true,
         preload:0,
         autoplay:true
    });
    // adds Arrows navigation control to the slider.
    slider.control('arrows');
    slider.control('timebar' , {insertTo:'#masterslider'});
    slider.control('bullets'); 
 
</script>
<?php }else  if($type == "partialview"){ ?> 
<script type="text/javascript">      
    var slider = new MasterSlider();
    slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space:10,
        loop:true,
        view:'prtialwave'
    });
     
    slider.control('arrows');  
    slider.control('slideinfo',{insertTo:"#partial-view-1" , autohide:false});
    slider.control('circletimer' , {color:"#FFFFFF" , stroke:9});
</script>
<?php }else  if($type == "showcase"){ ?> 
<script type="text/javascript">
    var slider = new MasterSlider();
    slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space:5,
        view:'scale'
    });
    slider.control('arrows');  
    slider.control('thumblist' , {autohide:false ,dir:'h',arrows:false});
     
</script>
<?php }else  if($type == "showcase_v"){ ?> 
<script type="text/javascript">
    var slider = new MasterSlider();
    slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space:5,
        view:'basic'
    });
     
    slider.control('arrows');  
    slider.control('scrollbar' , {dir:'h'});   
    slider.control('thumblist' , {autohide:false ,dir:'v',arrows:false});
</script>
<?php }else  if($type == "vertical"){ ?> 
<script type="text/javascript">      
    var slider = new MasterSlider();
    slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space:5,
        view:'basic',
        dir:'v'
    });
    slider.control('arrows');  
    slider.control('scrollbar' , {dir:'v'});   
    slider.control('circletimer' , {color:"#FFFFFF" , stroke:9});
    slider.control('thumblist' , {autohide:false ,dir:'v'});
</script>
<?php }else  if($type == "videogallery"){ ?> 
<script type="text/javascript">
    var slider = new MasterSlider();
    slider.setup('masterslider', {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space : 5,
        shuffle : true,
        loop : true,
        view : 'basic'
    });
     
    slider.control('arrows');
    slider.control('thumblist', {autohide : false,  dir : 'h'});
     
</script>
<?php }else  if($type == "videogallery_v"){ ?> 
<script type="text/javascript">
    var slider = new MasterSlider();
    slider.setup('masterslider', {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space : 5,
        shuffle : true,
        loop : true,
        view : 'mask'
    });
     
    slider.control('arrows');
    slider.control('thumblist', {autohide : false,  dir : 'v'});
     
</script>
<?php }else  if($type == "gallery"){ ?> 
<script type="text/javascript">      
    var slider = new MasterSlider();
    slider.setup('masterslider' , {
        width:<?php echo $width; ?>,
        height:<?php echo $height; ?>,
        space:10,
        preload:3,
        view:'basic'
    });
    slider.control('arrows');  
     
    var gallery = new MSGallery('partial-view-1' , slider);
    gallery.setup();
     
</script>
<?php } ?>
